<script setup>
const active = ref(0);
const menu = [
  {
    id: 1,
    title: "我如何报告漏洞？",
  },
  {
    id: 2,
    title: "什么是合格的漏洞？",
  },
  {
    id: 3,
    title: "什么是范围之外的漏洞？",
  },
  {
    id: 4,
    title: "我可以报告哪些特殊情况？",
  },
  {
    id: 5,
    title: "漏洞是如何分类的？",
  },
  {
    id: 6,
    title: "我将获得多少奖励？",
  },
  {
    id: 7,
    title: "谁有资格获得奖励？",
  },
  {
    id: 8,
    title: "谁决定漏洞报告的有效性？",
  },
  {
    id: 9,
    title: "我报告的漏洞需要多久可以获得回应？",
  },
];
const selectedCity = ref();
const cities = ref([
  { name: "New York", code: "NY" },
  { name: "Rome", code: "RM" },
  { name: "London", code: "LDN" },
  { name: "Istanbul", code: "IST" },
  { name: "Paris", code: "PRS" },
]);
</script>

<template>
  <div class="overflow-x-hidden">
    <!-- 头部导航 -->
    <div class="auto pc:max-w-[1200px] mobile:text-4xl mobile:px-10">
      <Nav />
    </div>

    <!-- 标语 -->
    <div
      class="use-netdisk w-full min-h-[250px] bg-[#F5F7FA] text-center mb-[70px] flex flex-col justify-center items-center mobile:h-[200px] mobile:px-10"
    >
      <h1
        class="text-[42px] leading-[100px] mobile:text-2xl font-bold mobile:mb-[20px]"
      >
        报告我们代码中的漏洞
      </h1>
      <p class="text-[#666]">
        如果您在我们的代码或基础架构中发现了安全漏洞并向我们报告，根据其复杂性和影响潜力，每个漏洞可获得最高10,000欧元的奖励。
      </p>
    </div>

    <div class="pc:hidden px-10 mb-[50px]">
      <h1 class="mobile:text-2xl font-bold mobile:mb-[20px]">目录</h1>
      <Dropdown
        v-model="selectedCity"
        :options="menu"
        
        optionLabel="title"
        placeholder="请选择"
        class="w-full border"
      />
    </div>

    <div class="auto pc:max-w-[1000px] mobile:text-4xl mobile:px-10">
      <div class="flex">
        <!-- 目录跳转 -->
        <div class="left w-[400px] font-bold mobile:hidden">
          <div class="border-[1px] py-[20px] max-h-[600px]">
            <div class="title pl-[40px] mb-[10px]">目录</div>
            <ul>
              <li
                class="leading-10 text-[#888] hover:text-[#333] pl-[50px] hover:bg-[#F1F5F9] cursor-pointer"
                :class="active == index ? 'active' : ''"
                v-for="(i, index) in menu"
                :key="i.id"
                @click="changeCatalogue(index)"
              >
                {{ i.title }}
              </li>
            </ul>
          </div>
        </div>
        <!-- 正文主体 -->
        <div class="right flex-1 ml-[40px]">
          <div>
            <h1
              class="text-[50px] leading-[100px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              关于如何报告漏洞的说明
            </h1>
            <p>
              我们努力成为您安全链中的一个强有力的环节，利用零知识加密的好处来保护您的数据和通讯。
              然而，没有人是完美的，我们也不是吗，这就是为什么如果您在我们的代码或基础设施中发现一个合格的漏洞，我们很想听到您的意见的原因。
            </p>
            <p>在与我们联系之前，请阅读本页面的所有信息，并按照说明操作。</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              我如何报告漏洞？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              什么是合格的漏洞？
            </h3>
            <ul>
              <li>- 在我们的任何服务器上执行远程代码，包括SQL注入缺陷。</li>
              <li>- 服务器端请求伪造。</li>
              <li>
                -
                在任何客户端浏览器上进行远程代码执行；例如，通过跨网站的脚本攻击。
              </li>
              <li>
                -
                任何破坏我们的加密安全模型和允许未经授权的远程访问密钥或数据，或操纵它们的行为。
              </li>
              <li>
                -
                访问控制和认证绕过，可能导致未经授权的覆盖和删除密钥或用户数据。
              </li>
              <li>
                - 在相关电子邮件地址被危及的情况下，任何危及用户账户数据的问题。
              </li>
            </ul>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              什么是范围之外的漏洞？
            </h3>
            <ul>
              <li>- 在我们的任何服务器上执行远程代码，包括SQL注入缺陷。</li>
              <li>- 服务器端请求伪造。</li>
              <li>
                -
                在任何客户端浏览器上进行远程代码执行；例如，通过跨网站的脚本攻击。
              </li>
              <li>
                -
                任何破坏我们的加密安全模型和允许未经授权的远程访问密钥或数据，或操纵它们的行为。
              </li>
              <li>
                -
                访问控制和认证绕过，可能导致未经授权的覆盖和删除密钥或用户数据。
              </li>
              <li>
                - 在相关电子邮件地址被危及的情况下，任何危及用户账户数据的问题。
              </li>
            </ul>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              我可以报告哪些特殊情况？
            </h3>
            <p>受损的静态CDN节点(*.static.mega.co.nz)</p>
            <p>
              让我们假设您已经入传了我们的一个静态内容服务器，并能够操纵从中提供的文件(包括所有的JavaScript代码).您会利用这一成就来危及我们的安全吗?
            </p>
            <p>
              免责声明:通过修改图像文件影响用户行为，虽然在这种情况下确实是一个潜在的漏洞，但被排除在外。
            </p>
            <p>受损的用户存储节点(*.userstorage.mega.co.nz)。</p>
            <p>
              假设您已经获得了我们其中一个存储节点的访问权限，并且能够自由地操纵它。您知道您的受害者即将下载一个驻留在该节点上的特定文件，但是您没有它的密钥。您是否能够操纵其内容，以便仍然可以下载而没有错误吗?
            </p>
            <p>受损的核心架构(*.api.mega.co.nz)</p>
            <p>
              这是最极端的情况。假设您已经破坏我们的运营核心，即API服务器。您是否能够欺骗API客户端交出没有任何传出共享的账户中文件的可用密钥吗?
            </p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              漏洞是如何分类的？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              我将获得多少奖励？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              谁有资格获得奖励？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              谁决定漏洞报告的有效性？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div>
            <h3
              class="text-[30px] leading-[80px] mobile:text-2xl font-bold mobile:mb-[20px]"
            >
              我报告的漏洞需要多久可以获得回应？
            </h3>
            <p>
              我们非常重视结构良好且清晰阐述问题的报告。因为这可以让我们复现和理解问题，而且您可以更快地获得更高的报酬。我们推荐阅读这篇文章，了解如何撰写漏洞奖励报告的技巧。
            </p>
            <p>当您的报告准备就绪，请将其发送至bug@mega.nz</p>
          </div>

          <div class="border"></div>

          <div class="mt-[30px] mb-[80px]">
            <h4 class="text-[24px] font-bold leading-[80px]">责任披露政策</h4>
            <p>
              请遵守行业标准的责任披露政策，从报告的漏洞被核实和确认之日起，有90天的时间，以
              便我们测试和部署任何修复措施。
            </p>
          </div>
        </div>
      </div>
    </div>

    <!-- 底部栏 -->
    <div class="foot auto pc:max-w-[1200px] mobile:px-10">
      <Foot />
    </div>
  </div>
</template>

<style scoped lang="scss">
p {
  color: #666;
  font-size: 18px;
  margin-bottom: 30px;
}
li {
  color: #666;
  margin-bottom: 20px;
  font-size: 18px;
}
.active {
  background-color: #e5fcff;
  color: #00e1ff;
  position: relative;
  &::after {
    position: absolute;
    display: block;
    content: "";
    width: 5px;
    height: 100%;
    background-color: #00e1ff;
    top: 0;
    left: 0;
  }
}
</style>
